<!DOCTYPE html>
<html>
<head>
	<title><%= title %></title>
	<link rel='stylesheet' href='/stylesheets/index.css' />
</head>
<body>
	<header>
		<h1><%=title %></h1>
		<ul class="type" id="type">
			<li data-type="dot">Dot</li>
			<li data-type="column" class="selected">Column</li>
		</ul>

		<p>
			Volume<input type="range" id="volume" min="0" max="100" value="60">
		</p>
	</header>
	<div class="left">
		<ul id="list">
			<% 
			  for(var i=0;i<music.length;i++)
			 {
			%>
			<li title="<%=music[i]%>"><%=music[i]%></li>
			<%}%>
		</ul>
	</div>
	<div class="right" id="box">
		
	</div>
	<script type="text/javascript" src="/javascripts/index.js"></script>
</body>
</html>
